/**
 * @Description:
 * @Author: CHEHSHUANG
 * @Date: 2019/3/14
 */
import React, {Component} from 'react';
import {} from "../service";
import {connect} from "react-redux";
import {hide, show} from "../../../configs/SharedReducer";
import {Form,message,Input,Button} from "antd";
import {listPersonnelByCode,listPaymentInfoByCode} from "../service";
import SimpleTable from "../../../commons/components/SimpleTable";
import {searchListByKeyWithTag} from "../../../commons/utils/CommonUtils";
import {confirm} from "../../../commons/components/StandardModal";
import {deletePaymentInfo} from "../service";
import PayInfoModal from "./PayInfoModal";
import {savePaymentInfo} from "../service";
class PayInfo extends Component {
  state = {
    data: [],
    selectedRows:[],
    personnel:null
  };

  componentDidMount() {
    this.listPersonnelByCode();
    this.listPaymentInfoByCode();
  }
  payInfoModalRef=(ref)=>{
    this.payInfoRef=ref
  }
  listPersonnelByCode = () => {
    this.props.show();
    listPersonnelByCode()
      .then(res => {
        if(res){
          let personnel=res.data;
          personnel.receiverId=personnel.id;
          personnel.receiverCode=personnel.code;
          personnel.receiverName=personnel.name;
          personnel.receiverType="H";
          this.setState({personnel: res.data});
        }
      })
      .finally(() => {
        this.props.hide();
      })
  }
  listPaymentInfoByCode = () => {
    this.props.show();
    listPaymentInfoByCode()
      .then(res => {
        if(res){
          this.setState({data: res.data});
        }
      })
      .finally(() => {
        this.props.hide();
      })
  };
  handleSearch = (value) => {
    searchListByKeyWithTag(this.state.data, {keyword: value},["bankId","receiverName","bankAccountNumber"]).then(data => {
      this.setState({data, searchValue: value})
    })
  };
  handleRowSelectChange = (selectedRows) => {
    this.setState({selectedRows})
  };
  handleModalVisible = (modalVisible, isAdd=this.state.isAdd) => {
    this.setState({modalVisible, isAdd})
  };
  savePaymentInfo=()=>{
    let formValue=null
    if(this.payInfoRef){
      formValue=this.payInfoRef.getPaymentInfo()
    }
    if (formValue){
      this.setState({confirmLoading:true});
      savePaymentInfo(formValue).then(res=>{
        if(res&&res.success){
          message.success(res.message?res.message:"保存成功")
          this.setState({confirmLoading:false,modalVisible:false});
          this.listPaymentInfoByCode();
        }else {
          message.success(res.message?res.message:"保存失败")
          this.setState({confirmLoading:false});
        }
      }).catch(()=>{
        this.setState({confirmLoading:false});
      })
    }
  };
  onModalCancel=()=>{
    this.handleModalVisible(false)
  };
  addClick = () => {
    const {personnel}=this.state;
    this.setState({editData:null})
    if (!personnel){
      message.error("公司员工中未查找到当前用户")
    }else {
      this.handleModalVisible(true, true)
    }
  };
  editClick=(record)=>{
    this.setState({editData:record})
    this.handleModalVisible(true, false)
  }
  deleteClick = (record) => {
    let thiz = this;
    confirm({
      title: "温馨提示",
      content: "删除后不可恢复，是否确定删除？",
      onOk() {
        let params = {};
        params = record.id;
        thiz.props.show();
        deletePaymentInfo(params).then(result => {
          if (result.status === "SUCCESS") {
            message.success(result.message ? result.message : "请求成功");
            //刷新本地数据
            thiz.listPaymentInfoByCode();
          } else {
            message.error(result.message ? result.message : "请求失败");
          }
        }).catch(e => {
        }).finally(() => {
          thiz.props.hide();
        })
      }
    });
  };
  render() {
    const columns = [
      {
        title: "操作",
        width:60,
        dataIndex: "operator",
        render: (text, record, index) => {
          return (
            <div className={'row-operator'}  onClick={(e) => {
              e.stopPropagation()
            }}>
              <a className={'row-operator-item'} onClick={()=>this.editClick(record)}>编辑</a>
              <a className={'row-operator-item'} onClick={()=>this.deleteClick(record)}>删除</a>
            </div>
          )
        }
      },
      {
        title: '收款方名称',
        dataIndex: 'receiverName',
        width: 200
      },
      {
        title: '银行代码',
        dataIndex: 'bank.code',
        width: 200
      },
      {
        title: '银行名称',
        dataIndex: 'bank.name',
        width: 200
      },
      {
        title: '银行账号',
        dataIndex: 'bankAccountNumber',
        width: 200
      },
      {
        title: '排序',
        dataIndex: 'rank',
        width:80,
      },
    ];
    const title = () => {
      return [
        <Button type={"primary"}  className={"primaryButton"}  key="edit" onClick={this.addClick}>新增</Button>,
      ]
    };

    //表头搜索框
    const search = () => {
      return [
        <Input.Search
          key="search"
          placeholder="输入名称或代码进行查询"
          onSearch={value => this.handleSearch(value)}
          style={{width: 220}}
          allowClear
        />
      ]
    };
    const {selectedRows,searchValue,data,modalVisible,personnel,editData,isAdd,confirmLoading}=this.state;
    return (
        <div className={"tbar-table"}>
          <div className={'tbar-box'}>
            <div className={'tbar-btn-box'}>{title()}</div>
            <div className={'tbar-search-box'}>{search()}</div>
          </div>
          <SimpleTable
            rowsSelected={selectedRows}
            onSelectRow={this.handleRowSelectChange}
            data={searchValue ? data.filter(item => item.tag === true) : data}
            columns={columns}
          />
          {modalVisible&&<PayInfoModal
            modalVisible={modalVisible}
            personnel={isAdd?personnel:editData}
            defaultValue={!isAdd&&editData?editData:{}}
            isAdd={isAdd}
            handleOk={this.savePaymentInfo}
            handleCancel={this.onModalCancel}
            onRef={this.payInfoModalRef}
            confirmLoading={confirmLoading}
          />}
        </div>

    );
  }
}

export default connect(null,{show,hide})(Form.create()(PayInfo));
